<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Modern Menu 3</title>
<link href="preview/preview.css" type="text/css" rel="stylesheet">
<link href="modern-menu/css/modern-menu.css" type="text/css" rel="stylesheet"> 
<script src="modern-menu/js/jquery-1.10.2.min.js" type="text/javascript"></script>
 <script src="modern-menu/js/jquery.transit.min.js" type="text/javascript"></script>
 <script src="modern-menu/js/jquery.modern-menu.min.js" type="text/javascript"></script>
 </head>
 <body class="horizontal">
 <div id="menu">

 
  
  
  </a></div>
  
  <ul class="modern-menu theme1">
    <li><a href="#"><span>HOME</span></a></li>
    <li><a href="#"><span>ABOUT</span></a></li>
  <li><a href="#"><span>SERVICES</span> </a>
  <ul>
  <li>
  <a href="#">
  <span>WEB DESIGN</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>PROGRAMING</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>ADVERTISING</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>MARKETING</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>PORTFOLIO</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>WEB DESIGN</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>PROGRAMING</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>JAVASCRIPT</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>MOBILE</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>OBJECTIVE-C</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>JAVASCRIPT</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>NODE.JS</span>
  </a>
  </li>
  <li>
  <a href="#"><span>RUBY</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>PHP / PERL</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>C++ / C#</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>ADVERTISING</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>MARKETING</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>CLIENTS</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>GREAT BRITAIN</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>UNITED STATES</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>LOS ANGELES</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>NEW YORK</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>WASHINGTON</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>BOSTON</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>LAS VEGAS</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>FRANCE</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>CANADA</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>AUSTRALIA</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>OFFICES</span>
  </a>
  <ul>
  <li>
  <a href="#">
  <span>LOS ANGELES</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>NEW YORK</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>LONDON</span>
  </a>
  </li>
  <li>
  <a href="#">
  <span>PARIS</span>
  </a>
  </li>
  </ul>
  </li>
  <li>
  <a href="#">
  <span>CONTACT</span>
  </a>
  </li>
  <ul class="mm-group mm-right">
  <li class="mm-icon">
  <a href="#">
  <span class="mm-facebook">
  </span>
  </a>
  </li>
  <li class="mm-icon">
  <a href="#">
  <span class="mm-twitter">
  </span>
  </a>
  </li>
  <li class="mm-icon">
  <a href="#">
  <span class="mm-googleplus">
  </span>
  </a>
  </li>
  <li class="mm-icon">
  <a href="#">
  <span class="mm-linkedin">
  </span>
  </a>
  </li>
  </ul>
  </ul>
  
  
   <script type="text/javascript">$(".modern-menu").modernMenu();</script></body></html>